<template>
  <div class="app-container">
    <el-row>
      <el-row>
        <el-select
          v-model="query.category"
          placeholder="DRG类别"
          style="width: 150px"
        >
          <el-option
            v-for="item in [
              {
                label: '全部（DRG类型）',
                value: '',
              },
              {
                label: '内科诊断组',
                value: '内科诊断组',
              },
              {
                label: '外科手术组',
                value: '外科手术组',
              },
              {
                label: '非手术室操作组',
                value: '非手术室操作组',
              },
            ]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>

        <el-select
          v-model="query.grpc"
          placeholder="组别"
          style="width: 150px; margin-left: 5px"
        >
          <el-option
            v-for="item in [
              {
                label: '全部（组别）',
                value: '',
              },
              {
                label: '不稳定组',
                value: '不稳定组',
              },
              {
                label: '稳定组',
                value: '稳定组',
              },
              {
                label: '基础组',
                value: '基础组',
              },
            ]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>

        <el-input
          size="medium"
          placeholder="编码、名称"
          suffix-icon="el-icon-search"
          style="width: 250px; margin-left: 5px"
          v-model="query.s"
          @keyup.enter.native="search"
        >
        </el-input>
        <el-button
          class="filter-item"
          style="margin-left: 10px"
          type="primary"
          icon="el-icon-search"
          @click="search"
        >
          {{ $t("table.search") }}
        </el-button>
      </el-row>
    </el-row>
    <el-row>
      <el-table :data="ls" style="width: 100%" v-loading="loading">
        <el-table-column prop="id" label="序号" width="80"> </el-table-column>
        <el-table-column prop="acode" label="ADRG编码"> </el-table-column>
        <el-table-column prop="aname" label="ADRG名称"> </el-table-column>
        <el-table-column prop="code" label="DRG编码"> </el-table-column>
        <el-table-column prop="name" label="DRG名称"> </el-table-column>
        <el-table-column prop="category" label="DRG类型"> </el-table-column>
        <el-table-column :formatter="numfmt" prop="point" label="点数">
        </el-table-column>
        <el-table-column prop="grpc" label="组别"> </el-table-column>
        <!-- <el-table-column :formatter="numfmt" prop="point" label="标准点数">
        </el-table-column> -->
        <el-table-column :formatter="numfmt" prop="stdcost" label="标准费用">
        </el-table-column>
      </el-table>
    </el-row>
    <el-row>
      <pagination
        v-show="query.total > 0"
        :total="query.total"
        :page.sync="query.page"
        :limit.sync="query.size"
        @pagination="loadLs"
      />
    </el-row>
  </div>
</template>
  

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { DrgDic } from "@/api/datatranform";
import Pagination from "@/components/Pagination/index.vue";
import { cloneDeep } from "lodash";
import { Form } from "element-ui";
import { parseTime } from "@/utils";

@Component({
  name: "SysCompany",
  components: {
    Pagination,
  },
})
export default class extends Vue {
  private query = {
    s: "",
    page: 1,
    size: 10,
    total: 0,
    category: "",
    grpc: "",
  };

  private search() {
    this.query.page = 1;
    this.loadLs();
  }
  private numfmt(row: any, column: any) {
    return (row[column.property] || 0).toFixed(4);
  }
  private ls: any = [];
  private loading: boolean = false;

  private async loadLs() {
    this.loading = true;
    const { data } = await DrgDic(this.query);
    this.ls = data.content;
    this.query.total = data.totalElements;
    this.loading = false;
  }
  private created() {
    this.loadLs();
  }
}
</script>